/* CSS Document */

#main{
	padding:10px 0;
	border: none;
	width:326px;
	height:100px;
	margin:100px auto;	
}

#main2{
	padding:10px 0;
	border: none;
	width:326px;
	height:300px;
	margin:100px auto;	
}

/* Colors for form validity */

input:valid {  }

input:invalid{
   border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red;
}

.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }

/* These selection declarations have to be separate
   No text-shadow: twitter.com/miketaylr/status/12228805301
   Also: hot pink! */
::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; }

small { font-size: 85%; }

/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }

input{ vertical-align: middle; margin: 0;}

input, button { font:99% sans-serif; }

input{
  background-color: #4d5155;
  font-family: "Helvetica Neue", Helvetica,Arial,sans-serif;
}

button {  width: auto; overflow: visible; }

form, fieldset, span, dev{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

label, button{
	font-family:MisoRegular, Helvetica,Arial,sans-serif;
	text-transform:uppercase;
	letter-spacing:4px;
	font-size:1.4em;
	color:#fff;
}

.password{
	float:left;
	margin:8px 0;
	font-family:MisoRegular, Helvetica,Arial,sans-serif;
	text-transform:uppercase;
	letter-spacing:4px;
	font-size:1em;
	color:#fff;
}

input{
	background-color:#303030;
	-webkit-border-radius: .4em;
	-moz-border-radius: .4em;
	border-radius: .4em;
	-moz-box-shadow: 0 -1px 0 0px #000;
	-webkit-box-shadow: 0 -1px 0 0px #000;
	box-shadow: 0 -1px 0 0px #000;	
	border: none;
	width:316px;
	height:27px;	
	margin:15px 0;
	color:#fff;
	padding:0 0 0 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1.2em;
	letter-spacing:2px;
}

.ico{
	float:right;
}

button{
	width:79px;
	height:24px;
	text-align:center;
	border:none;
	float:right;
	background: #363535;
	background: -webkit-gradient(linear, left top, left bottom, from(#3a3a3a), to(#303030));
	background: -moz-linear-gradient(bottom,  #303030,  #3a3a3a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a3a3a', endColorstr='#303030');
	-webkit-border-radius: .2em;
	-moz-border-radius: .2em;
	border-radius: .2em;
	-webkit-box-shadow: 0 0px 1px rgba(255,255,255,0.1);
	-moz-box-shadow: 0 0px 1px rgba(255,255,255,0.1);
	box-shadow: 0 0px 1px rgba(255,255,255,0.1);
	color:#fff;
	text-align:right;
}

button:hover{
	background: #363535;
	background: -webkit-gradient(linear, left top, left bottom, from(#4b4b4b), to(#303030));
	background: -moz-linear-gradient(bottom,  #303030,  #4b4b4b);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4b4b4b', endColorstr='#303030');
}

button:active{
	border:none;
	-webkit-box-shadow: 0 0px 2px rgba(255,255,255,0.2);
	-moz-box-shadow: 0 0px 2px rgba(255,255,255,0.2);
	box-shadow: 0 0px 2px rgba(255,255,255,0.2);
}

input:focus:required:invalid {
	color:#000;
}

@font-face{
    font-family: 'MisoRegular';
    src: url('../font/miso-webfont.eot');
    src: url('../font/miso-webfont.eot?#iefix') format('eot'),
         url('../font/miso-webfont.woff') format('woff'),
         url('../font/miso-webfont.ttf') format('truetype'),
         url('../font/miso-webfont.svg#webfontk1DRByuk') format('svg');
    font-weight: normal;
    font-style: normal;
}	